import styled from 'styled-components'

export const AlbumWrapper = styled.div`
  width: ${props => props.width + "px"};
  height: 200px;


.album-image {
  position: relative;
  width: ${props => props.width + "px"};
  height: ${props => props.size + "px"};
  overflow: hidden;
  margin-top: 15px;

  img {
    width: ${props => props.size + "px"};
    height: ${props => props.size + "px"};
  }

  .cover {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-position: 0px ${props => props.bgp + "px"};
    text-indent: -9999px;
  }
}

.album-info {
  font-size: 12px;
  width: ${props => props.size};
  .name {
    color: #000;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .artist {
    color: #666;
  }
}
`